<template>
	<div class="wrap">
		<head-title :title="headText" @callback="onClickLeft"></head-title>
		<div class="wrapbd">
            <div class="roll_i">
                <span>{{payname}}</span>
                <input type="text" placeholder='请输入账号' v-model.trim="cardType">
            </div>
			<input class="l_button" type="button" value="确认" :disabled="disableBtn" @click="revisename()">
		</div>
	</div>
</template>
<script>
	import HeadTitle from "./../../components/title.vue";   
	export default {
		data(){
			return {
				headText: '',  //顶部标题
				payname:'',
				cardType: '',
				disableBtn:false,
			}
		},
		mounted(){
            this.$route.query.type=='zfb'?(this.headText = '支付宝',this.payname = '支付宝账号') : (this.headText = '微信',this.payname = '微信账号');
		},
		methods:{
			//左上角返回键
			onClickLeft () { this.$router.go(-1);},
			//确认修改
			revisename(){
				var _this = this;
				if(!this.Tools.regCombination.null.test(_this.cardType)){
                    this.$toast({message: '请输入账号', position: 'bottom'})
                }else{
					this.revise();
                }   	
			},
			revise(){
				let _this = this,data = {};
				this.disableBtn = true; 
				this.$route.query.type=='zfb'? data={alipay: this.cardType}:data={wechat: this.cardType};
				this.Tools.AXIOS({
					url:'user/edit',
					transformRequest:data,
					success:function (res) { 
						_this.$toast.success('修改成功');
						setTimeout(function(){
							_this.$router.push('/bankCard')
						},3000)
					},
					error(res){
						_this.disableBtn = false;
					}
				})
			}
		},
		components: {
			HeadTitle,
		},
	}
</script>
<style scoped>
.wrapbd .roll_i{ width: 100%; display: flex; background: #fff; padding: .5rem 0; border-bottom: 1px solid #F6F6F6; position: relative;}
.wrapbd .roll_i span{ font-size: .35rem; text-indent: 12px;}
.wrapbd .roll_i input{ width: 60%; margin-left: .5rem; font-size: .35rem;}
.wrapbd p{ padding: 0 .3rem; font-size: .3rem; color: #bbbbbb;}
.wrapbd .l_button{ width: 90%; display: block; margin: 10% auto 0; padding: .3rem 0; background: #00990B; text-align: center; font-size: .4rem; color: #fff; border-radius: 6px;}
.verycode button{ right: .2rem;}
</style>
